<template>
  <div class="specItem">
    <van-button
      :plain="true"
      :hairline="!isChecked"
      :type="isChecked ? 'primary' : 'default'"
      @click="itemClick"
      >{{ data.label }}</van-button
    >
  </div>
</template>

<script>
import { Button } from "vant";
export default {
  components: {
    [Button.name]: Button,
  },
  props: {
    data: {
      type: Object,
      default: () => {
        return {};
      },
    },
    isChecked: {
      type: Boolean,
      default: false,
    },
    index: {
      type: Number,
      default: -1,
    },
  },
  methods: {
    itemClick() {
      this.$emit("item-click", { ...this.data, index: this.index });
    },
  },
};
</script>

<style lang="scss" scoped>
.specItem {
  padding: 12px;
}
</style>